<template>
	<view class="dtlView">
		<view v-if="checkType==2">
			<view v-if="checkData != null">
				<view class="patientInfo">
					<view class="title">
						基本信息
					</view>
					<view class="name">
						<text class="left">就诊人</text>
						<text>{{checkData.realName}}</text>
					</view>
					<view class="name">
						<text class="left">性别</text>
						<text>{{checkData.sex}}</text>
					</view>
					<view class="icd1">
						<text class="left">检查部位</text>
						<text>{{checkData.body}}</text>
					</view>
					<view class="time">
						<text class="left">医生名称</text>
						<text>{{checkData.doctor}}</text>
					</view>
				</view>
				<view class="icd">
					<view class="title">
						检查结果
					</view>
					<moveMenu v-if="showDeepSeek == 1" ref="moveMenu" :imgType='2' :content="checkData.reportMessage" dictCode='01'></moveMenu>
					<view class="icdItem">
						<text style="color: #000;">检查所见：</text>{{checkData.reportMessage}}
					</view>
					<view class="icdItem">
						<text style="color: #000;">检查结果：</text>{{checkData.repostResult}}
					</view>
				</view>
			</view>
			<view class="noCard" v-else>
				<view class="images">
					<img src="@/static/images/noCard.png" alt="">
					<view>
						未查询到信息
					</view>
				</view>
			</view>
		</view>
		<view v-if="checkType==1">
			<view v-if="checkData != null">
				<view class="patientInfo">
					<view class="title">
						基本信息
					</view>
					<view class="name">
						<text class="left">就诊人</text>
						<text>{{checkData.realName}}</text>
					</view>
					<view class="name">
						<text class="left">年龄</text>
						<text>{{checkData.age}}</text>
					</view>
					<view class="time">
						<text class="left">标本种类</text>
						<text>{{checkData.sample}}</text>
					</view>
					<view class="dept">
						<text class="left">采样时间</text>
						<text>{{checkData.checkDate}}</text>
					</view>
				</view>
				<view class="patientInfo">
					<view class="title">
						项目及检查结果
					</view>
					<moveMenu v-if="showDeepSeek == 1" ref="moveMenu" :imgType='2' :content="checkResult" dictCode='01'></moveMenu>
					<view class="items">
						<text style="flex: 2;color: #999;">项目</text>
						<text style="flex: 1;color: #999;">值</text>
						<text style="flex: 1;color: #999;">参考值</text>
					</view>
					<view class="items" v-for="(item,index) in checkResultList" :key="index">
						<view style="flex: 2;" v-if="item.conclusion=='正常'">
							<text>{{item.itemName}}</text>
						</view>
						<view style="flex: 2;" class="flex col_r" v-if="item.conclusion=='偏高'">
							<text>{{item.itemName}}</text>
						</view>
						<view v-if="item.conclusion=='阳性'" class="up col_r" style="flex: 2;">
							<text>{{item.itemName}}</text>
						</view>
						<view v-if="item.conclusion=='偏低'" class="up col_g" style="flex: 2;">
							<text>{{item.itemName}}</text>
						</view>
						
						
						<view style="flex: 1;" v-if="item.conclusion=='正常'">
							<view class="iconWrap"><text>{{item.realResult}}</text></view>
						</view>
						<view style="flex: 1;" v-if="item.conclusion=='偏高'">
							<view class="iconWrap flex align-center col_r"><text>{{item.realResult}}</text>
							<u-icon name="arrow-upward" size="1rem" color="#FF3141"></u-icon></view>
						</view>
						<view class="col_r" style="flex: 1;" v-if="item.conclusion=='阳性'">
							<view class="iconWrap"><text>{{item.realResult}}</text></view>
						</view>
						<view class="col_g" style="flex: 1;" v-if="item.conclusion=='偏低'">
							<view class="iconWrap flex align-center"><text>{{item.realResult}}</text>
							<u-icon name="arrow-downward" size="1rem" color="#22B35E"></u-icon></view>
						</view>

						<text style="flex: 1;">{{item.referprint}}</text>
					</view>
				</view>
			</view>
			<view class="noCard" v-else>
				<view class="images">
					<img src="@/static/images/noCard.png" alt="">
					<view>
						未查询到信息
					</view>
				</view>
			</view>
		</view>
		<!-- loading -->
		<u-overlay :show="loading" :opacity="0.6">
			<view class="warp">
				<view class="rect" @tap.stop>
					<view class="lds-ripple">
						<view></view>
						<view></view>
					</view>
				</view>
			</view>
		</u-overlay>

		<!-- <u-button class="m-t-15 m-b-15" type="primary" style="width:90%;">复诊挂号</u-button> -->
	</view>
</template>

<script>
	import {
		getInspectResult,
		getlisResult
	} from "@/api/beInHospital/index.js"
	import moveMenu from "@/pages/mine/moveMenu/index.vue";
	import { getConfigKey } from "@/api/home/home.js";
	export default {
		components: {
			moveMenu
		},
		data() {
			return {
				showDeepSeek:'',
				loading: false,
				checkType: 1,
				checkData: {
					reportMessage:''
				},
				checkResultList:[],
				checkResult:'',
			}
		},
		filters: {
			age(val) {
				if (val == undefined) {
					return
				}
				if (val.indexOf('岁') == -1) {
					let str = str.split("岁").join("")
					return str
				} else {
					return val
				}
			}
		},
		onLoad(options) {
			this.checkType = options.checkType
			if (options.checkType == 2) {
				this.loading = true;
				this.getConfig();
				this.getInspectResult(options.id)
			} else if (options.checkType == 1) {
				this.loading = true
				this.getConfig();
				this.getlisResult(options.id)
			}
		},
		methods: {
			/* 获取参数配置 */
			getConfig() {
				getConfigKey('isenabled').then(res => {
					this.showDeepSeek = res.msg;
				});
			},
			getInspectResult(id) {
				getInspectResult({
					queryId: id,
					checkType: this.checkType
				}).then(res => {
					this.loading = false
					if (res.data.length > 0) {
						this.checkData = res.data[0] || null
					} else {
						this.checkData = null
					}
				})
			},
			getlisResult(id) {
				getlisResult({
					queryId: id,
					checkType: this.checkType
				}).then(res => {
					this.loading = false
					if (res.data.length > 0) {
						this.checkData = res.data[0] || null
						this.checkResultList = res.data;
						this.checkResultList.forEach(item=>{
							this.checkResult += '项目'+item.itemName+' 结果'+item.conclusion+' 参考值'+item.referprint+' '
						})
						
					} else {
						this.checkData = null
						this.checkResultList = []
						this.checkResult = ''
					}

				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: rgb(245, 245, 245);
	}

	.noCard {
		width: 100%;
		text-align: center;
		color: #666666;
		padding: 24rpx 0 0 0;
		margin-top: 72rpx;
		color: #808080;

		.images {
			width: 100%;
			margin-bottom: 40rpx;
			color: #666666;

			img {
				width: 55%;
				text-align: center;
			}
		}
	}

	.dtlView {
		width: 100%;
		height: 100vh;
		overflow-y: auto;
	}

	.patientInfo {
		/* width: 95%;*/
		margin: 24rpx;
		// padding: 0 24rpx;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		border-radius: 8px;
		padding-bottom: 12rpx;

		.navigation {
			width: 100%;
			text-align: right;
			color: #1677FF;
			font-size: 28rpx;
		}

		.title {
			padding: 24rpx;
			display: flex;
			font-size: 32rpx;
			font-weight: 600;
			align-items: center;
			border-bottom: 1rpx solid #eee;
			// margin-bottom: 10px;
		}

		.name,
		.icd1,
		.time,
		.dept {
			display: flex;
			justify-content: space-between;
			padding: 12rpx 24rpx;

			.left {
				color: #999;
				width: 130rpx;
			}
		}

		.items {
			border-bottom: 1rpx solid #eee;
			padding: 12rpx 24rpx;
			display: flex;
			align-items: center;
			font-size: 13px;

			.up {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 4rpx 0;

				.iconWrap {
					display: flex;
					align-items: center;
				}
			}

			.down {
				width: 100%;
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 4rpx 0;

				.iconWrap {
					display: flex;
					align-items: center;
				}
			}
		}
	}

	.icd {
		// width: 95%;
		margin: 24rpx;
		display: flex;
		flex-direction: column;
		background-color: #fff;
		border-radius: 8px;
		padding-bottom: 12rpx;

		.title {
			padding: 24rpx;
			display: flex;
			font-size: 32rpx;
			font-weight: 600;
			align-items: center;
			border-bottom: 1rpx solid #eee;
			// margin-bottom: 10px;
		}

		.icdItem {
			padding: 12rpx 24rpx;
			color: #FF6430;
		}
	}
	.col_r{color:#FF3141 !important;}
	.col_g{color:#22B35E !important;}
</style>